<template>
  <v-app-bar
    :elevation="9"
    class="text-center"
    flat
    style="border-radius: 15px"
  >
    <v-icon>
      <img alt="lazy_cat"
           src="https://sakura-cjq.oss-rg-china-mainland.aliyuncs.com/homepage/lazy_cat.png"
           style="width: auto; height: 230%; margin-left:150px"
      >
    </v-icon>

    <v-toolbar-title class="title">
      <span>河南大学流浪小动物图鉴</span>
    </v-toolbar-title>

    <!--    <v-spacer></v-spacer>-->

    <a href="https://www.henu.edu.cn/">
      <v-btn icon style="margin-right: 25px">
        <v-icon>
          <img alt="河南大学"
               class="enlarge-image"
               src="https://img2.baidu.com/it/u=2905407378,1250838945&fm=253&fmt=auto&app=138&f=JPEG?w=503&h=500"
               style="width: 250%; height: 250%;"
          >
        </v-icon>
      </v-btn>
    </a>
  </v-app-bar>
</template>

<style scoped>
.enlarge-image {
  transition: transform 0.3s ease-in-out; /* 添加过渡效果 */
}

.enlarge-image:hover {
  transform: scale(1.1); /* 在:hover时放大1.2倍，你可以根据需要调整比例 */
}

.title {
  position: relative;
  font-size: 190%;
}

</style>


